﻿<%@ Page Language="C#" MasterPageFile="~/default.master" AutoEventWireup="true"
    CodeBehind="Profiler.aspx.cs" Inherits="Chinook.Web.Profiler" %>
<asp:Content ID="Content1" ContentPlaceHolderID="BodyContentPlaceholder" runat="Server">
    <h1 class="title-regular clearfix">Profiler</h1>
    <div id="dvRegistrationForm">
        <table>
            <tr>
                <td>
                    <label for="txtTitle">
                        <%=Resources.Chinook.Form.Labels.lblClass%></label>
                </td>
                <td>
                   <asp:DropDownList ID="dropClassName" runat="server"></asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td>
                    <label for="txtFirstName">
                        <%=Resources.Chinook.Form.Labels.lblMethod%></label>
                </td>
                <td>
                    <asp:DropDownList ID="dropMethodName" runat="server">
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td>
                    <label for="txtLastName">
                        <%=Resources.Chinook.Form.Labels.lblDateRange%></label>
                </td>
                <td>
                    <input type="text" class="text date" title="date" id="txtStart" tabindex="3" />
                    &nbsp;
                    to
                    &nbsp;
                    <input type="text" class="text date" title="date" id="txtEnd" tabindex="3" />
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                </td>
                <td>
                    <input type="submit" id="btnSearch" value="Search" class="button medium blue"
                        tabindex="12" />
                </td>
            </tr>
        </table>
    </div>
    <div>
        <table>
            <tr>
                <td>
                </td>
            </tr>
            <tr class="YUI_CAT_PAGER">
                <td>
                    <table>
                        <tr>
                            <td>
                                <span id="paginate"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <div id="profilerDatatable">
                                </div>
                            </td>
                        </tr>                     
                    </table>
                </td>
            </tr>
            <tr id="sorry">
            <td>
            <span style="color:Red;"> Sorry no records found!...</span>
            </td>
            </tr>
        </table>
    </div>

    <script type="text/javascript">
        var ds = [];

        //--------------------------------------------------------------------------------------------------
        // 
        //--------------------------------------------------------------------------------------------------
        $(function() {
        $("#btnSearch").click(btnSearchHandler);
        });
        //--------------------------------------------------------------------------------------------------
        // 
        //--------------------------------------------------------------------------------------------------
        function btnSearchHandler() {
            var ProfilerRequest = {};
            ProfilerRequest.ClassName = $("#ctl00_BodyContentPlaceholder_dropClassName").val();
            ProfilerRequest.MethodName = $("#ctl00_BodyContentPlaceholder_dropMethodName").val();
            ProfilerRequest.Start = $("#txtStart").val();
            ProfilerRequest.End = $("#txtEnd").val();

            var params = JSON.stringify({ 'profilerRequest': ProfilerRequest });
            $.ajax({
                type: "POST",
                url: _absWebRoot + "ProfilerWebService.asmx/GetProfilerLogs",
                data: params,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: OnprofilerSuccess,
                error: OnprofilerError
            });           
            return false;
        }
        //--------------------------------------------------------------------------------------------------
        // 
        //--------------------------------------------------------------------------------------------------
        function OnprofilerSuccess(res) {
            //1)Delare a variable to specifiy the identitifer for the datatable
            var dataTableName = "dtProfiler";

            if (res.d.ProfilerViewModels.length == 0) {
                $(".YUI_CAT_PAGER").hide();
                $("#sorry").show();
                return false;
            }
            $("#sorry").hide();
            $(".YUI_CAT_PAGER").show();
            
        
            //Datasource
            for (var i = 0; i < res.d.ProfilerViewModels.length; i++) {
                ds[i] = res.d.ProfilerViewModels[i];
            }
            

            

            //2)Declare a varibale to specify the div name where the datatable should be rendered in the DOM i.e. container
            var containerName = "profilerDatatable";
            //3)
            var columns = []; //the columns format will be like this "key | label | sortable | sort order | resizeable|Formatter|Width" delimited by pipe symbol (|)
            var columnDefinitionString = "ClassName|Class Name|false|null|false|null|225*MethodName|Method Name|false|null|false|null|null*ExecutionTime|Response Time (sec)|false|null|false|null|null*ExecutionDateAndTime|Execution Date|false|null|false|FormatterDate|125";
            columns = columnDefinitionString.split('*');
            for (z = 0; z < columns.length; z++) {
                columns[z] = columns[z].split('|');
            }
            //4)Declare the list of db columns we need it for the datasource delimited by pipe symbol (|)
            var dbCols = 'ClassName|MethodName|ExecutionTime|ExecutionDateAndTime';

            var Formatters = 'FormatterDate';
            var PagenatorConfig = '["paginate"]|25|[5,10,15,20,25]|8| <strong>{CurrentPageReport}</strong> {PreviousPageLink} {PageLinks} {NextPageLink} {RowsPerPageDropdown} |<font color="#000000"><b><font color="green">{totalRecords} records found </font></b></font>';

            var DTConfig = [];
            DTConfig[0] = null;
            DTConfig[1] = "Cell_Clicked";
            DTConfig[2] = null; 
            DTConfig[3] = "100%";
            DTConfig[4] = null;

            MakeDataTable(dataTableName
                , containerName
                , columns
                , dbCols.split('|')
                , ds
                , PagenatorConfig
                , Formatters
                , DTConfig);
            return false;

        }

        function OnprofilerError(res) {
            alert(res);
        }

        //----------------------------------------------------------------------------------------------------------------
        //Formatter for the DateAssigned column ( Call the function in the DatatableHelper.js
        //----------------------------------------------------------------------------------------------------------------
        function FormatterDate(elCell, oRecord, oColumn, oData) {
            elCell.innerHTML = YUIDateFormatDMMMYYYY(oData, "%d-%b-%Y");
        }

    </script>
</asp:Content>
